<template>
  <view class="main">
    <!-- <view class="header"></view> -->
    <view class="bottom">
		<view @click="toStory">
			<image
			  src="https://qianjin-file.oss-cn-beijing.aliyuncs.com/app/static/1-3.png"
			  alt=""
			/>
		</view>

      <image
        src="https://qianjin-file.oss-cn-beijing.aliyuncs.com/app/static/1-1.png"
        alt=""
        @click="toMarriageCulture"
      />
      <image
        src="https://qianjin-file.oss-cn-beijing.aliyuncs.com/app/static/1-2.png"
        alt=""
        @click="toBanquet"
      />
    </view>
  </view>
</template>

<script setup>
import { onMounted, ref } from "vue";
import { useRouter } from "vue-router";

const router = useRouter();

const toStory = () => {
	console.log(111);
		uni.navigateTo({
		    url: '/pages/story/index'
		})
};
const toMarriageCulture = () => {
	console.log(33);
		uni.navigateTo({
		    url: '/pages/marriageCulture/index'
		})
};
const toBanquet = () => {
  router.push({
    name: "Banquet",
  });
};
</script>

<style lang="scss" scoped>
.main {
  display: flex;
  flex-direction: column;
  justify-content: flex-end;
  position: relative;
  width: 100vw;
  height: 100vh;
  background: url("https://qianjin-file.oss-cn-beijing.aliyuncs.com/app/static/bg.png")
    no-repeat center center;
  background-size: cover;

  .header {
    z-index: 999999;
    height: 9.61vh;
  }
  .bottom {
    display: flex;
    justify-content: space-between;
    height: 23.4vh;
    margin: 0 6.5vw;
    image {
		width: 26vw;
      height: 11vh;
    }
  }
}
</style>